<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>I’m QQ-每一天，乐在沟通</title>
    <link type="text/css" rel="stylesheet" href="css/style.css">
   
</head>
<body>
    <header class="nav-header" style="position:absolute;">
        <div class="nav-contain">
            <a href="https://im.qq.com/index" class="nav-logo"><img src="img/2.png" width="98" height="50" ></a>
            <nav class="nav-top">
                <ul>
                    <li><a href="https://im.qq.com/index">首页</a></li>
                    <li><a href="https://im.qq.com/download">下载</a></li>
                    <li><a href="https://im.qq.com/news">动态</a></li>
                </ul>
            </nav>
            <div class="nav-fill"></div>
            <div class="tools-top">
                <a href="https://ssl.zc.qq.com/v3/index-chs.html" class="tools-login">注册</a>
            </div>
            <div class="tools-right">
                <ul>
                    <li><a href="https://vip.qq.com/">QQ会员</a></li>
                    <li><a href="https://aq.qq.com/cn2/index">QQ安全</a></li>
                    <li><a href="">登录</a></li>
                </ul>
            </div>
        </div>
    </header>
        <div class="crossbanner wrap" style="width:100%;height:940px;overflow:hidden;">
                   <ul id="crossbanner" style="width:100%;height:940px;overflow:hidden;position: relative;
                   min-width: 1007px;
                   margin: 0 auto;">
               <li id="d" class="pcqq" style="background-image:url('img/pc_bg.jpg');position:absolute;left:0;top:0;right:0;bottom:0;z-index:1;background-size:cover;background-repeat:no-repeat;background-position:50%;">
                    <img src="img/pc-feture.png" class="pic1" >
                    <img src="img/title-text-1366s.png" class="pic2"> 
                    <a href="https://im.qq.com/pcqq" target="_blank" class="btn-download" style="background-image:url('img/btn-download@2x.png');">下载</a></li>
                   <li class="mqq" id="c" style="background-image:url('img/20190627155257_hfDit78vGr.jpeg');position:absolute;left:0;top:0;right:0;bottom:0;z-index:1;background-size:cover;background-repeat:no-repeat;background-position:50%;">
                        <img src="img/898pc前景.png" class="pic1"> 
                        <img src="img/20190627155257_gyEc8vQq8v.png" class="pic2"> 
                        <a href="https://im.qq.com/mobileqq" target="_blank" class="btn-download" style="background-image:url('img/20190627155257_AKTPvWAw4Y.png');">下载</a>
                    </li>

                         <div class="circle" style="position:relative;width:100%;height:52px;margin-top:900px;background:transparent url(img/linearbot.png) repeat-x 0 0;text-align:center;z-index:5"><span class="" id="a">&nbsp;</span><span class="on" id="b" >&nbsp;</span></div>
         
                   </div>
                   <div id="content" class="content">
                    <h1 class="brand"><img src="img/brand.png" alt="I'm QQ - 每一天，乐在沟通"></h1> 
                    <ul class="content-list"><li class="qcall left"><div id="firstbg" data-stellar-background-ratio="0.03" class="activebg firstbg" style="background-image:url('img/fisrtbg.jpg');background-position:center 0px;"></div> 
                        <div class="qfigure"><div class="qw960"><div class="txtwrap"><h2>沟通，是跨越<br>千山万水的亲切声音</h2> 
                            <p>无论何时何地，你都能自由享受QQ在各类终端<br>上带来的高清通话，与好友一起想聊多久聊多久</p> 
                            <p><a href="https://im.qq.com/album/v/" target="_blank" class="knmore">
                    了解更多 &gt;
                  </a></p> <ul class="figs"><li class="f01">
                    两人、多人通话
                  </li><li class="f02">
                    群组通话
                  </li><li class="f03">
                    屏幕分享
                  </li></ul></div> <div class="pic qcallAnimate">
                    <img src="img/pic1.png"></div></div></div></li>
                    <li class="qfile right"><div id="secondbg" data-stellar-background-ratio="0.05" class="activebg secondbg" style="background-image:url('img/avd.jpg');background-position:center 0px;"></div> 
                        <div class="qfigure"><div class="qw960"><div class="txtwrap"><h2>沟通，是随时随地<br>爽快收发</h2> <p>通过QQ,电脑和手机上的文件都能收发自如，<br>更有手机在线查阅，轻松你的工作和生活。</p> <!----> 
                            <ul class="figs"><li class="f01">
                    文件漫游
                  </li><li class="f02">
                    多端互传
                  </li><li class="f03">
                    在线预览
                  </li></ul></div>
                   <div class="pic qfileAnimate">
                    <img src="img/pic2.png"></div></div></div></li></ul></div>
            <div class="newfoot">
            <div class="qmaps">
                <div class="plats">
                    <h3>了解热门产品</h3>
                    <a  href="https://im.qq.com/mobileqq"
                    target="_blank" class="plmb">
                    <span></span>
                    <p>QQ 手机版</p>
                    </a>
                    <a  href="https://im.qq.com/pcqq" target="_blank" class="plpc">
                    <span></span>
                    <p>QQ Windows版</p>
                    </a>
                    <a pvg="" href="https://im.qq.com/macqq" target="_blank" class="plmac">
                    <span></span>
                    <p>QQ Mac版</p>
                    </a>

                </div>
                <div class="links">
                    <div clss="map qac" style="float:left;width: 120px;">
                        <h3 style="height: 25px;
                        color: #666;
                        font-size: 14px;
                        margin-bottom: 4px;">QQ安全</h3>
                        <ul>
                            <li style="line-height: 22px;">
                                <a pgv="" href="javascript:void(0)" target="_blank">安全中心</a>
                            </li>
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://110.qq.com/" target="_blank">冻结账号</a>
                            </li>
                            <li>
                                <a pgv="" href="https://aq.qq.com/v2/safe school/report index.shtml" target="_blank">举报恶意行为</a>
                            </li style="line-height: 22px;">
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://huifu.qq.com/" target="_blank">恢复好友和群</a>
                            </li>
                        </ul>
                    </div>
                    <div clss="map qfaq" style="float:left;width: 120px;">
                        <h3 style="height: 25px;
                        color: #666;
                        font-size: 14px;
                        margin-bottom: 4px;">帮助反馈</h3>
                        <ul>
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://kf.qq.com/product/QQ.html" target="_blank">腾讯客服</a>
                            </li style="line-height: 22px;">
                            <li>
                                <a pgv="" href="https://support.qq.com/discuss/44_1.shtml" target="_blank">反馈问题</a>
                            </li>
                            <li style="line-height: 22px;">
                                <a pgv="im.index2015.maps.undefined" href="https://weibo.com/u/2508053484" target="_blank">新浪微博</a>
                            </li>
                        </ul>
                    </div>
                    <div clss="map qlink" style="float:left;width: 120px;">
                        <h3 style="height: 25px;
                        color: #666;
                        font-size: 14px;
                        margin-bottom: 4px;">友情链接</h3>
                        <ul>
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://qun.qq.com/" target="_blank">QQ群</a>
                            </li>
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://y.qq.com/#type=index" target="_blank">QQ音乐</a>
                            </li>
                            <li style="line-height: 22px;">
                                <a pgv="im.index2015.maps.undefined" href="https://browser.qq.com/" target="_blank">QQ浏览器</a>
                            </li>
                        </ul>
                    </div>
                    <div clss="map" style="float:left;width: 120px;">
                        <h3 style="height: 25px;
                        color: #666;
                        font-size: 14px;
                        margin-bottom: 4px;">友情链接</h3>
                        <ul>
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://v.qq.com/" target="_blank">QQ群</a>
                            </li>
                            <li style="line-height: 22px;">
                                <a pgv="" href="https://guanjia.qq.com/" target="_blank">QQ音乐</a>
                            </li>
                            <li style="line-height: 22px;">
                                <a pgv="im.index2015.maps.undefined" href="https://fm.qq.com/" target="_blank">QQ浏览器</a>
                            </li>
                        </ul>
                    </div>
                    </div>
             </div>   
        
              <!--版权-->
            <div  class="copyright" >
             
               <p> Copyright &copy; 1998 - 2021 Tencent . All Rights Reserved</p>
              
                        <p>       腾讯公司 版权所有</p>
            
              
    
               
              
             
        </div>

</body>
<script>
    document.getElementById("a").onmouseover=function(){
        if(this.className==""){
            this.className="on";
            document.getElementById("b").className="";
            document.getElementById("c").style.display="none";
            document.getElementById("d").style.display="block";
        }
    }
    document.getElementById("b").onmouseover=function(){
        if(this.className==""){
            this.className="on";
            document.getElementById("a").className="";
            document.getElementById("d").style.display="none";
            document.getElementById("c").style.display="block";
        }
    }
    window.onload=function(){
        var x=0;
        setInterval(function(){
            if((x/2)%2==1){
                document.getElementById("a").className="on";
                document.getElementById("b").className="";
            document.getElementById("c").style.display="none";
            document.getElementById("d").style.display="block";

            }else if((x/2)%2==0){
                document.getElementById("b").className="on";
                document.getElementById("a").className="";
            document.getElementById("d").style.display="none";
            document.getElementById("c").style.display="block";

            }
            x++
        },2000)
    }
 </script>
</html>